<template>
	<view>
		<view style="padding: 5px; display: flex;">
			<u-search :show-action="false"></u-search>
			<u-button type="primary" size="small" style="width: 90px; margin-left: 10px;" shape="circle"
				icon="share">分享</u-button>
		</view>

		<!--单词课本学习-->
		<view style="background-color: #aaff7f; margin: 10px;border-radius: 10px;">
			<view style="padding: 15px; display: flex;">
				<view style="position: relative;">
					<image src="http://rc.metahike.com/bookcovers/tbb_c1a.jpg" style="width: 76px;height: 100px;">
					</image>
					<view
						style="position: absolute; bottom: 5px; background-color: #00aaff; width: 100%;color: #FFF; font-size: 12px; text-align: center; line-height: 20px;">
						更换词书</view>
				</view>
				<view style="padding: 0px 10px; font-size: 12px;">
					<view style="font-weight: bold;font-size: 18px;">小学英语五年级下册</view>
					<view>学习进度<1% </view>
					<view>
						<u-line-progress :percentage="30" height="8" :showText="false" activeColor="#55aa00"></u-line-progress>
					</view>
				</view>

			</view>
			<view style="display: flex;justify-content: center;">
				<view><u-button type="primary">单元学习</u-button></view>
				<view><u-button type="primary">单元复习</u-button></view>
			</view>
			
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				title: 'Hello'
			}
		},
		onLoad() {

		},
		methods: {

		}
	}
</script>

<style>

</style>